html {
  width: 100%;
  height: 100%;
}

.pcView {
  width: 100%;
  height: 100%;
}

.swiper-slide {
  position: relative;
}

.swiper-container .swiper-slide:nth-child(1) {
  width: 100%;
  height: 100%;
  background: url("../img/bg.png") no-repeat !important;
  background-size: 100% 100% !important;
}

.swiper-container .swiper-slide:nth-child(2) {
  width: 100%;
  height: 100%;
  background: url("../img/bg2.png") no-repeat !important;
  background-size: 100% 100% !important;
}

.swiper-container .swiper-slide:nth-child(3) {
  width: 100%;
  height: 100%;
  background: url("../img/bg2.png") no-repeat !important;
  background-size: 100% 100% !important;
}

.swiper-container .swiper-slide:nth-child(4) {
  width: 100%;
  height: 100%;
  background: url("../img/bg3.png") no-repeat !important;
  background-size: 100% 100% !important;
}

.swiper-container .swiper-slide:nth-child(5) {
  width: 100%;
  height: 100%;
  background: url("../img/bg3.png") no-repeat !important;
  background-size: 100% 100% !important;
}

.swiper-pagination-bullet {
  width: 0.0625rem;
  height: 0.0625rem;
}

.swiper-pagination-bullet-active {
  background: #fecd58;
  width: 0.0625rem;
  height: 0.125rem;
  border-radius: 0.03125rem;
}

nav {
  position: fixed;
  display: flex;
  justify-content: space-between;
  width: 100%;
  box-sizing: border-box;
  padding: 0px 0.3125rem;
  top: 0.23958rem;
  font-size: 0.15625rem;
  font-family: Source Han Sans CN;
  font-weight: 800;
  color: #00002c;
  z-index: 50;
}

nav .left {
  display: flex;
  align-items: center;
}

nav .logo {
  width: 0.1875rem;
  height: 0.1875rem;
  margin-right: 0.08333rem;
}

.slide1 .desc {
  width: 6.61458rem;
  height: 1.76562rem;
  margin-left: 50%;
  transform: translateX(-50%);
}

.amimate1 {
  position: absolute;
  left: 25.5%;
  bottom: 8.5%;
  width: 4.6875rem;
  height: 3.125rem;
  z-index: 1;
}

#demoCanvas {
  width: 100%;
  height: 100%;
}

.amimate1 .imgs {
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translateX(-50%);
  width: 0.89583rem;
  height: 0.89583rem;
}

section {
  margin-top: 0.46875rem;
  text-align: center;
  line-height: 0.46875rem;
}

section p {
  font-size: 0.26042rem;
  font-family: Source Han Sans CN;
  font-weight: 800;
  color: #add7fd;
}

.top {
  font-size: 0.3125rem;
  font-family: Source Han Sans CN;
  font-weight: 800;
  color: #00002c;
}

.btns {
  position: absolute;
  display: flex;
  justify-content: space-between;
  width: 4.54167rem;
  height: 0.42188rem;
  margin-left: 28%;
  margin-top: 0.15625rem;
  z-index: 9999;
}

.btns svg {
  margin-right: 12px;
}

.btns svg g {
  stroke: red;
}

.btns .btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.375rem;
  height: 0.42188rem;
  border-radius: 0.21354rem;
  background: #ffffff;
  font-size: 0.15625rem;
  font-family: Medium;
  font-weight: bold;
  color: #00002c;
}

.last {
  top: 50%;
  z-index: 999;
}

.QRcode {
  position: absolute;
  bottom: -350%;
  display: flex;
  justify-content: space-between;
  width: 4.54167rem;
  height: 1.4375rem;
  margin-left: 50%;
  transform: translateX(-50%);
}

.QRcode .codes {
  width: 1.36979rem;
  height: 100%;
  opacity: 0;
}

.tops {
  top: -350%;
}

.desc {
  position: absolute;
  top: 20%;
  left: 7%;
  color: #000000;
  font-weight: 600;
  line-height: 0.67708rem;
}

.desc .top1 {
  font-size: 0.52604rem;
  font-family: Source Han Sans CN;
}

.desc .top2 {
  position: relative;
  top: 0.10417rem;
  font-size: 0.20833rem;
  font-family: Source Han Sans CN;
  padding-left: 0.29167rem;
}

.desc .top3 {
  font-size: 0.20833rem;
  font-family: Source Han Sans CN;
  padding-left: 0.44271rem;
}

.twos {
  left: 40%;
}

.logos {
  position: absolute;
  left: 0px;
  bottom: 0px;
  width: 2.47396rem;
  height: 2.41667rem;
}

.iphone {
  position: absolute;
  top: 15%;
  right: 7%;
  width: 2.66667rem;
  height: 3.41146rem;
}

.popup {
  position: absolute;
  bottom: -0.05208rem;
  right: 0.20833rem;
  width: 0.77604rem;
  height: 0.65625rem;
}

.next {
  position: absolute;
  bottom: 0.83333rem;
  left: 50%;
  width: 0.23438rem;
  height: 0.14062rem;
  transform: translateX(-50%);
  z-index: 99;
}

.animate2 {
  position: absolute;
  top: -6%;
  left: -9%;
  width: 10rem;
  height: 5.625rem;
  z-index: 2;
}

#animate2 {
  width: 100%;
  height: 100%;
}

.news {
  position: absolute;
  top: 15%;
  left: 7%;
  width: 2.66667rem;
  height: 3.41146rem;
}

.shupian_news {
  position: absolute;
  top: -17%;
  left: 15%;
  width: 0.46354rem;
  height: 0.42708rem;
}

.photo {
  position: absolute;
  bottom: 12%;
  right: 5%;
  width: 0.77604rem;
  height: 0.6875rem;
}

.ratation {
  position: absolute;
  bottom: 12%;
  right: 10%;
  width: 1.86979rem;
  height: 1.86979rem;
}

.ratation #ratation {
  width: 100%;
  height: 100%;
}

.string {
  position: absolute;
  width: 1.22917rem;
  height: 0.8125rem;
  left: 10%;
  bottom: 16%;
}

.airplane {
  position: absolute;
  width: 0.76042rem;
  height: 0.69792rem;
  bottom: 0%;
  right: 9%;
}

.rank {
  position: absolute;
  width: 0.54167rem;
  height: 0.92708rem;
}

.index1 {
  top: 16%;
  right: 11.5%;
}

.index2 {
  top: 27%;
  left: 11.5%;
}

.index3 {
  top: 62%;
  left: 11.5%;
}

.index4 {
  top: 50%;
  right: 11.5%;
}

.animate3 {
  position: absolute;
  left: 50%;
  bottom: 15%;
  width: 3.02083rem;
  height: 1.71875rem;
  transform: translateX(-50%);
}

.animate3 #animate3 {
  width: 100%;
  height: 100%;
}

.footer {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  top: 18%;
  left: 50%;
  transform: translateX(-50%);
  line-height: 0.44271rem;
}

.footer .mainlogo {
  width: 0.625rem;
  height: 0.625rem;
}

.footer .second {
  font-size: 0.25rem;
  font-family: Medium;
  font-weight: bold;
  color: #4A89FD;
}

.footer .third {
  font-size: 0.3125rem;
  font-family: Medium;
  font-weight: bold;
  color: #000030;
}

.lyric {
  position: absolute;
  width: 1.85938rem;
  height: 0.66667rem;
  top: 25%;
  left: 50%;
  transform: translateX(-50%);
}

.footer_text {
  position: absolute;
  bottom: 18%;
  left: 50%;
  line-height: 0.15625rem;
  transform: translateX(-50%);
  text-align: center;
  font-size: 0.09375rem;
  font-family: Source Han Sans CN;
  font-weight: 700;
  color: #000000;
  vertical-align: middle;
}

.police_logo {
  position: relative;
  top: 0.01823rem;
  display: inline-block;
  width: 0.09375rem;
  height: 0.10417rem;
}
